<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<div id="app">
			<h1>大家都喜欢的彩妆</h1>
			<ul>
				<li v-for="(item,index) in type">
					<p>{{index+1}}--{{item.name}}</p>
					<p><img v-bind:src="item.imageurl" ></p>
					<p>￥{{item.price}}最近{{item.goumaiNumber}}人购买</p>
				</li>
			</ul>
		</div>
		<script src="js/vue.min.js"></script>
		<script type="text/javascript">
			new Vue({
				el:'#app',
				data:{
					type:[
					]
				},mounted:function(){
					this.type=[
						{'name':'Za姬芮新能真皙美白隔离霜35g','imageurl':'image/icon-1.jpg','price':59.9,'goumaiNumber':13403},
						{'name':'美宝莲精纯矿物奇妙新颜乳霜BB霜30ml','imageurl':'image/icon-2.jpg','price':89.00,'goumaiNumber':13610},
						{'name':'菲奥娜水漾CC霜40g','imageurl':'image/icon-3.jpg','price':59.9,'goumaiNumber':13403},
						{'name':'HC蝶翠诗橄榄卸妆油200ml','imageurl':'image/icon-4.jpg','price':59.9,'goumaiNumber':13403}
					]
				}
			});
		</script>
	</body>
</html>
